<template>
	<div class="transactionBox" ref="scroll">
		<div class="transaction" ref="dH">
			<ul class="title">
				<li @click='buyIndex = 0,topNav($event)' :class="{checked: buyIndex === 0}">求购</li>
				<li @click='buyIndex = 1,topNav($event)' :class="{checked: buyIndex === 1}">出售</li>
			</ul>
			<div class="con">
				<table>
					<tr><th>订单时间</th><th v-if="buyIndex == 0">求购者</th><th v-else>出售者</th><th>当前市值</th><th>数量</th><th>状态</th></tr>
					<tr v-for="(item, index) in initData" :key="index" @click='saveObj(item)'>
						<td>{{ item.trade_time | fmtDate | time}}</td>
						<td>{{ item.from_men | from_men}}</td>
						<td>{{ item.price }}</td>
						<td>{{ item.trade_num }}</td>
						<td @click='sellBtn(item)'>{{ item.status | TXLStatus}}</td>
					</tr>
				</table>
			</div>
			<div class="noData" v-if="initData.length == 0">暂无数据</div>
		</div>

		<confirm v-model="buyShow" :title='`确定${isSell}？`' @yes='buyPass = true'></confirm>
		<confirm v-model="buyPass" :title='`请输入登录密码`' :inputShow='true' @yes='buy'></confirm>
	</div>
</template>

<script>
import { buying, sell, receiptSellerOut, receiptTradeIn, paymentPass } from '../../../config/getData'
import addScroll from '../../../assets/js/transactionLoad'
import Confirm from '../../component/confirm/confirm';

export default {
	data(){
		return {
			buyIndex:0,
			initData:[],
			total:-1,
			page:1,
			isSell:'卖出',
			buyShow: false,
			buyPass: false,
			clickObj: null
		}
	},
	filters:{
		from_men(str){
			return str.substr(0,2) + '****'
		},
		time(str){
			return str.substr(11,5)
		}
	},
	methods:{
		sellBtn(item){
			this.buyShow = true
			this.isSell = item.status == 1 ? '卖出' : '买入'
		},
		buy(str){
			//验证密码
			if( str == '') {
				this.$vux.toast.show({
					text: res.msg,
					width:'auto',
				})
				return
			}
			paymentPass(str).then( async res => {
				this.buyPass = false;

				var retData;

				if(this.buyIndex == 0){
					await receiptSellerOut( this.clickObj.id, this.clickObj.trade_type ).then( res => {
						retData = res
					})
				}else{
					await receiptTradeIn( this.clickObj.id, this.clickObj.trade_type ).then( res => {
						retData = res
					})
				}

				this.$vux.toast.show({
					text: retData.msg,
					type:'success',
				})
				this.$router.push('/home/delegate/3')
			})

		},
		saveObj(item){
			this.clickObj = item
		},
		topNav(e){
			// if(e && e.type == 'click'){
			// 	this.page = 1
			// }
			this.page = 0;
			if(this.buyIndex === 0){
				buying(this.page).then( res => {
					this.page++
					this.initData = res.data.data
					this.total = res.data.total
				})
			}else if( this.buyIndex === 1){
				sell().then( res => {
					this.page++
					this.initData = res.data.data
					this.total = res.data.total
				})
			}
		}
	},
	created(){
		this.topNav()
	},
	mounted(){
		addScroll(this)
	},
	components:{
		Confirm,
	}
}
</script>



<style lang="scss" scoped>
.Gtitle{margin:20px 0 6px 15px;}
.noData{color:#666;margin:20px auto 10px;text-align: center;}
.transaction{
	ul{display: flex;background-color: #fff;
		li{width:50%;text-align: center;line-height: 40px;font-size:16px;border-top:2px solid transparent;color:#808080;}
		li.checked{border-top:2px solid #e86e50;color:#333;}
		li + li{border-left:1px solid #f5f5f5;}
	}
}
</style>
